.logo{
    margin-left: 100px;
}
.middle{
    position: relative;
    right: 10%;
    background-image: url('../images/bg.png');
    width: 120%;
    height: 500px;
    background-size: cover;
    position: relative;
}
.middle .login-form{
    position: absolute;
    top: 20px;
    left: 65%;
    background-color: white;
    width: 400px;
    height: 400px;
}

.bottom{
  text-align: center;  
}
.bottom p{
    color: #A1A1A1;
}
.bottom p a{
    color: #A1A1A1;
    margin-right: 5px;
}
/* 登录 */
.login {
    position:absolute;
    top: 3%;
    left: 60%;
    max-width: 400px;
    margin: 50px auto;
    padding: 20px;
    background-color: #fff;
    /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); */
}

/* .login h2 {
    text-align: center;
    color: #333;
} */

.login form {
    margin-top: 30px;
}

.login label {
    display: block;
    margin-bottom: 5px;
}
 .username {

    display: flex;
    height: 30px;
    margin-bottom: 15px;
  }
.password {
    width: 100%;
    display: flex;
    height: 30px;
   
  }

.login button {
    width: 100%;
    padding: 14px 20px;
    margin-top: 20px;
    background-color: red;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.login button:hover {
    opacity: 0.8;
}

.login a {
    float: right;
    color: blue;
    text-decoration: none;
    margin-top: -25px;
}

.code{
    margin-right: 230px;
}
.social{
    display: flex;
    width: 200px;
    justify-content: space-between;
    margin-left: 5px;
    margin-top: 40px ;
    
}
.forget{
   position: relative;
   top: 20px;
}
.warn{
   font-size: 12px; 
   background-color:rgba(251, 229, 200, 0.3);
   padding: 2px;
   padding-left: 15px;
}
.email{
    width: 450px;
}
